<template>
  <status-bar></status-bar>
  <back-page name="arrow-left">
    <text class="text-base font-medium ml-4">账号与安全</text>
  </back-page>
  <setting-icon-to :icon-list="iconLists">
    <template #showData>
      <text class="text-base font-medium ml-3">{{ mobile }}</text>
    </template>
    <template #showPasswordDesc>
      <text class="text-base font-medium ml-3">修改密码</text>
    </template>
  </setting-icon-to>
</template>

<script setup lang="ts">
import BackPage from '@/layout/components/BackPage.vue'
import StatusBar from '@/layout/PageItemComponents/statusBar.vue'
import SettingIconTo from '@/layout/PageItemComponents/settingIconTo.vue'
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'

interface iconList {
  iconName: string
  text: string
  toUrl: string
}

const iconLists = ref<iconList[]>([
  {
    iconName: '',
    text: '手机号',
    toUrl: 'user-bindphone'
  },
  {
    iconName: '\ue60c',
    text: '登录密码',
    toUrl: 'user-reset-password'
  }
])
// 接收从账号与安全的手机号
const mobile = ref('')
onLoad((query) => {
  if (query && query.phone) {
    console.log(query.phone)
    mobile.value = query.phone
  }
})
</script>

<style scoped lang="scss"></style>
